/**
 *
 *
 * @author TOTORO
 * @date 2021/4/29 9:53
 */
// 全部变量，用于判断是否通过系列验证
    //密码格式   密码重复      会员名格式
var ck1 = false,ck2 = false, ck3 = false,ck4 = false;
// jq
$(function () {
    // 密码输入框焦点事件
    $('#pwd').focus(function () {
        $('.ts-tip').css('display','block');
    }).blur(changeMsg).keyup(changeTs);

    // 再次输入密码进入焦点事件
    $('#pwd2').focus(function () {
        $('#pwd-error2').show();
        $('#pwd-error2 i:eq(0)').removeClass('children_icon1').addClass('msg-icon');
        $('#pwd-error2 i:eq(1)').show().text('请再次输入你的密码').css('color','black');
        $(this).css('border','1px solid #dedede');
    }).blur(function () {
        // 拿到现在的值于之前的值进行比较
        var nowVal = $(this).val(), beforeVal = $('#pwd').val();
        if(nowVal!=beforeVal) {
            ck2 = false;
            $('#pwd-error2 i:eq(0)').removeClass('msg-icon').addClass('children_icon1');
            $('#pwd-error2 i:eq(1)').text('两次输入的密码不一致！').css('color','red');
            $(this).css('border', '1px solid red');
        } else{
            ck2 = true;
            $('#pwd-error2 i:eq(0)').removeClass('msg-icon').addClass('children_icon2');
            $('#pwd-error2 i:eq(1)').text('').hide();
            $(this).css('border','1px solid #dedede');
        }
        if(''==nowVal){
            $('#pwd-error2').hide();
        }
    });

    // 支付密码焦点事件
    $("#payPassword").focus(function () {
        if($(this).val()=="" || $(this).val().length==0){
            $("#pay-error").children(":eq(1)").css("color","black").text("请输入你的支付密码");
            $("#pay-error").children(":eq(0)").removeClass("children_icon1").addClass("msg-icon");
            $("#pay-error").show();
        } else{
            $("#pay-error").hide();
        }
    }).blur(function () {
        if($(this).val().length==0 || $(this).val() == ""){
            $("#pay-error").children(":eq(0)").removeClass("msg-icon").addClass("children_icon1");
            $("#pay-error").children(":eq(1)").css("color","red").show();
            return;
        }
        if($(this).val().length!=6){
            $("#pay-error").children(":eq(0)").removeClass("msg-icon").addClass("children_icon1");
            $("#pay-error").children(":eq(1)").css("color","red").text("支付密码必须是6位数！");
            $("#pay-error").show();
            return;
        }
        if(!Totoro.isNumber($(this).val())){
            $("#pay-error").children(":eq(0)").removeClass("msg-icon").addClass("children_icon1");
            $("#pay-error").children(":eq(1)").css("color","red").text("支付密码必须是数字！");
            $("#pay-error").show();
            return;
        }
        $("#pay-error").hide();
    })

    // 设置会员名焦点事件
    $('#vip').focus(function () {
        $('#vip-error').show();
    }).blur(function () {
        // 判断会员名是否合法
        var va = $(this).val();
        var is = $('#vip-error i');
        // 用户名合格
        // 1.判断长度是否为5
        if(va.length<5){
            is.eq(0).removeClass('msg-icon').removeClass('children_icon2').addClass('children_icon1');
            is.eq(1).text('5-25个字符，推荐使用中文，请勿包含姓名/身份证/银行卡等隐私信息，一旦设置成功无法修改').css('color','red');
            $(this).css({'border':'1px solid red','color':'red'});
            $('.suggest-container').hide();
            ck3 = false;
        } else{
            if(Totoro.isNumber(va)){
                is.eq(0).removeClass('msg-icon').removeClass('children_icon2').addClass('children_icon1');
                $(this).css({'border':'1px solid red','color':'red'});
                is.eq(1).text('不能全部为数字').css('color','red');
                $('.suggest-container').hide();
                ck3 = false;
            } else{
                // ajax从服务端验证是否被注册
                $.ajax({
                    type:"POST",
                    url:"${pageContext.request.contextPath}/register/name_test.htm",
                    async:false, // 是否异步处理
                    data: {'name': $(this).val()},
                    success:function (tj) {
                        // 字符串转json
                        var json = tj.toString().replaceAll("\'", "\"");
                        testJson = $.parseJSON(json);
                        var flag = testJson.flag > 0;
                        // 如果有该会员名，则生成新会员名供选择
                        if (flag) {
                            is.eq(0).removeClass('msg-icon').removeClass('children_icon2').addClass('children_icon1');
                            is.eq(1).text('该用户名已被使用，请重新输入').css('color','red');
                            $("#vip").css({'border':'1px solid red','color':'red'});
                            // 展示选择框
                            $('.suggest-container').show();
                            // 赋值新会员名 获得ul
                            var ul = $("#new-name");
                            ul.children(":eq(1)").text(testJson.u1);
                            ul.children(":eq(2)").text(testJson.u2);
                            ul.children(":eq(3)").text(testJson.u3);
                            // li点击事件
                            ul.children().not(":eq(0)").click(function () {
                                $("#vip").val($(this).text());
                                // 点击过后，关闭弹框
                                $('.suggest-container').hide();
                                is.eq(0).removeClass('children_icon1').removeClass('msg-icon').addClass('children_icon2');
                                is.eq(1).text('');
                                $("#vip").css({'border':'1px solid #DEDEDE','color':'#676767'});
                                ck3 = true;
                            });
                            // 输入无误
                        } else{
                            ck3 = true;
                            is.eq(0).removeClass('children_icon1').removeClass('msg-icon').addClass('children_icon2');
                            is.eq(1).text('');
                            $("#vip").css({'border':'1px solid #DEDEDE','color':'#676767'});
                        }
                    }
                })
            }
        }
    });

    function changeMsg() {
        $('.ts-tip').css('display','none');
        var pwdVal = $(this).val();
        // 密码长度合格
        var length = pwdVal.length>5 && pwdVal.length<21;
        // 密码内容合格
        var pwd = /^(?![A-Z]+$)(?![a-z]+$)(?!\d+$)(?![\W_]+$)\S{6,20}$/.test(pwdVal);
        // 如果密码长度没有6并且没由字符组成
        if(!pwd){
            $(this).css('border', '1px solid red');
            $('#pwd-error').css('display','inline-block')
            $('#pwd-error i:first').addClass('children_icon1');
            ck1 = false;
        } else{
            // 密码合格
            $(this).css('border','1px solid #dedede');
            ck1 = true;
        }
    }
    /**
     * 改变密码强弱状态
     */
    function changeTs(){
        // 获取密码内容
        var pwdVal = $(this).val();
        // 获取再次输入密码内容，在这里也需要判断！
        var pwd2Val = $("#pwd2").val();
        if(pwdVal != pwd2Val){
            ck2 = false;
            $('#pwd-error2 i:eq(0)').removeClass('msg-icon').removeClass("children_icon2").addClass('children_icon1');
            $('#pwd-error2 i:eq(1)').text('两次输入的密码不一致！').show().css('color','red');
        } else{
            ck2 = true;
            $('#pwd-error2 i:eq(0)').removeClass('msg-icon').removeClass("children_icon2").addClass('children_icon1');
            $('#pwd-error2 i:eq(1)').text('').hide();
            $(this).css('border','1px solid #dedede');
        }
        // 如果没输入
        if(null == pwdVal || '' == pwdVal){
            $('.ts-rule-length i').text('').removeClass().addClass('ordinary-icon');
            $('.ts-rule-legal i').text('').removeClass().addClass('ordinary-icon');
            $('.ts-rule-multi i').text('').removeClass().addClass('ordinary-icon');
            // 密码强度改变
            $('.ts-strength-bar span').css('background','#DCDCDC');
            $('.ts-strength-bar em').text('');

            $(this).css('border', '1px solid red');
            $('#pwd-error').css('display','inline-block')
            $('#pwd-error i:first').addClass('children_icon1');
        } else{
            // 数字判断值
            var length = pwdVal.length>5 && pwdVal.length<21;
            if(length){
                $('.ts-rule-length i').html('&#10004').removeClass('small-error-icon').addClass('small-yes-icon');
            } else{
                $('.ts-rule-length i').html('&#10006').removeClass('ordinary-icon').removeClass('small-yes-icon').addClass('small-error-icon');
            }
            // 除空格判断值
            var blank = pwdVal.indexOf(' ')==-1 && pwdVal.length>0;
            if(blank){
                $('.ts-rule-legal i').html('&#10004').removeClass('ordinary-icon').removeClass('small-error-icon').addClass('small-yes-icon');
            } else{
                $('.ts-rule-legal i').html('&#10006').removeClass('ordinary-icon').removeClass('small-yes-icon').addClass('small-error-icon');
            }
            // 判断字母字符值
            var pwd = /^(?![A-Z]+$)(?![a-z]+$)(?!\d+$)(?![\W_]+$)\S{6,20}$/.test(pwdVal);
            console.log(pwd);
            if(pwd){
                $('.ts-rule-multi i').html('&#10004').removeClass('small-error-icon').removeClass('ordinary-icon').addClass('small-yes-icon');
            } else{
                $('.ts-rule-multi i').html('&#10006').removeClass('ordinary-icon').removeClass('small-yes-icon').addClass('small-error-icon');
            }

            var superPwd = /(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*[\W_]).{6,20}/.test(pwdVal);
            // 改变密码强弱图
            // 每执行一次，先返回原状态
            $('.ts-strength-bar span').css('background','#DCDCDC');
            $('.ts-strength-bar em').text('');
            if(superPwd){
                $('.ts-strength-bar span').css('background','#0A9E00');
                $('.ts-strength-bar em').css('color','#0A9E00').text('强');
            } else if((length && blank) || (length && pwd) || (blank && pwd)){
                $('.ts-strength-bar span:lt(2)').css('background','#FF6A00');
                $('.ts-strength-bar em').css('color','#0A9E00').text('中');
            } else if(length || blank || pwd){
                $('.ts-strength-bar span:lt(1)').css('background','#FF460F');
                $('.ts-strength-bar em').css('color','#FF460F').text('弱');
            }

            if(superPwd){
                // 密码设置不符合要求
                $(this).css('border', '1px solid #dedede;');
                $('#pwd-error').css('display','inline-block');
                $('#pwd-error i:first').addClass('children_icon2');
                $('#pwd-error .error-text').text('强度：').css('color','black');
                $('#pwd-error i:eq(2)').text('高').css({'color':'#0A9E00','font-size':'12px'});
            }
            else if(length && pwd){
                // 设置密码强度中等提示
                $(this).css('border', '1px solid #dedede;');
                $('#pwd-error').css('display','inline-block');
                $('#pwd-error i:first').addClass('children_icon2');
                $('#pwd-error .error-text').text('强度：').css('color','black');
                $('#pwd-error i:eq(2)').text('中').css({'color':'#FF6A00','font-size':'12px'});
            } else{                    // 密码设置不符合要求
                $(this).css('border', '1px solid red');
                $('#pwd-error').css('display','inline-block');
                $('#pwd-error i:first').addClass('children_icon1');
                $('#pwd-error .error-text').text('密码设置不符合要求').css('color','red');
                $('#pwd-error i:eq(2)').text('')
            }
        }
    }

    // 提交注册表单
    $('#rsbmt').click(function () {
        if(ck1 && ck2 && ck3){
            $('vip-submit').submit();
        } else{
            return false;
        }
    })
});